<script setup>

import {onMounted, ref} from "vue";

const props = defineProps({
  data:{
    type: Object,
    required:true
  }
})
const mode = ref('horizontal');
onMounted(() => {
    //获取当前屏幕宽度
    const screenWidth = window.innerWidth;
    if (screenWidth < 768) {
        mode.value = 'vertical';
    }
})
</script>

<template>
  <div class="flex justify-center w-full">
    <div class="mr-2">
      {{data.orders}}.
    </div>
    <div class="w-full">
      <div v-html="data.content"></div>
      <!-- 答题区域-->
      <div class="mt-3">
          <a-radio-group :direction="mode" v-model="data.value" :options="data.options">
              <template #label="{ data }">
                  <p v-html="data.content"></p>
              </template>
          </a-radio-group>
      </div>
    </div>


  </div>
</template>

<style scoped>

</style>
